import 'package:flutter/material.dart';
import 'package:read_book/data/book_mall/book_mall.dart';
import 'package:read_book/ui/pages/classify/classify_info.dart';

class Classify extends StatefulWidget {
  const Classify({Key key}) : super(key: key);

  @override
  _ClassifyState createState() => _ClassifyState();
}

class _ClassifyState extends State<Classify> {
  Map<dynamic, dynamic> data = {};
  bool _isManExpanded = false;
  bool _isWomanExpanded = false;
  bool _isCartoonExpanded = false;
  bool _isPressExpanded = false;

  //获取小说分类
  void getType() {
    BookMall().getType().then((value) {
      setState(() {
        data = value;
      });
    });
  }

  @override
  void initState() {
    getType();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 4,
      child: Scaffold(
        appBar: AppBar(
          leading: IconButton(
            icon: const Icon(Icons.keyboard_backspace),
            onPressed: () {
              Navigator.pop(context);
            },
            color: Colors.black54,
          ),
          actions: <Widget>[
            IconButton(
              icon: const Icon(Icons.search),
              onPressed: () {
                Navigator.pushNamed(context, '/search');
              },
              color: Colors.black54,
            )
          ],
          backgroundColor: Colors.grey[50],
          title: const Center(
            child: Text(
              '分类',
              style: TextStyle(color: Colors.black54, fontSize: 16.0),
            ),
          ),
        ),
        body: Container(
          alignment: Alignment.center,
          child: ListView(
            children: <Widget>[
              ExpansionPanelList(
                children: <ExpansionPanel>[
                  ExpansionPanel(
                      headerBuilder: (context, isExpanded) {
                        return const ListTile(
                          title: Text(
                            '男生分类',
                            style: TextStyle(color: Colors.black54),
                          ),
                        );
                      },
                      body: buildTYpeList(data['male'], 'male'),
                      isExpanded: _isManExpanded,
                      canTapOnHeader: true),
                  ExpansionPanel(
                      headerBuilder: (context, isExpanded) {
                        return const ListTile(
                          title: Text('女生分类',
                              style: TextStyle(color: Colors.black54)),
                        );
                      },
                      body: buildTYpeList(data['female'], 'female'),
                      isExpanded: _isWomanExpanded,
                      canTapOnHeader: true),
                  ExpansionPanel(
                      headerBuilder: (context, isExpanded) {
                        return const ListTile(
                          title: Text('漫画分类',
                              style: TextStyle(color: Colors.black54)),
                        );
                      },
                      body: buildTYpeList(data['picture'], 'picture'),
                      isExpanded: _isCartoonExpanded,
                      canTapOnHeader: true),
                  ExpansionPanel(
                      headerBuilder: (context, isExpanded) {
                        return const ListTile(
                          title: Text('出版分类',
                              style: TextStyle(color: Colors.black54)),
                        );
                      },
                      body: buildTYpeList(data['press'], 'press'),
                      isExpanded: _isPressExpanded,
                      canTapOnHeader: true)
                ],
                expansionCallback: (panelIndex, isExpanded) {
                  switch (panelIndex) {
                    case 0:
                      setState(() {
                        _isManExpanded = !isExpanded;
                      });
                      break;
                    case 1:
                      setState(() {
                        _isWomanExpanded = !isExpanded;
                      });
                      break;
                    case 2:
                      setState(() {
                        _isCartoonExpanded = !isExpanded;
                      });
                      break;
                    case 3:
                      setState(() {
                        _isPressExpanded = !isExpanded;
                      });
                      break;
                    default:
                      setState(() {
                        _isManExpanded = false;
                        _isWomanExpanded = false;
                        _isCartoonExpanded = false;
                        _isPressExpanded = false;
                      });
                      break;
                  }
                },
                animationDuration: kThemeAnimationDuration,
              )
            ],
          ),
        ),
      ),
    );
  }

  Widget buildTYpeList(List context, type) {
    return ListView.builder(
      shrinkWrap: true,
      physics: const NeverScrollableScrollPhysics(),
      itemCount: context.length,
      itemBuilder: (BuildContext data, int index) {
        return GestureDetector(
          onTap: () {
            Navigator.push(data, MaterialPageRoute(builder: (_) {
              return ClassifyInfo(gender: type, data: context[index]);
            }));
          },
          child: Container(
            height: 40.0,
            decoration: const BoxDecoration(
                border: Border(
                    bottom: BorderSide(width: 1, color: Color(0xffe5e5e5)))),
            child: Row(
              children: <Widget>[
                Container(
                  width: 100.0,
                  padding: const EdgeInsets.only(left: 20.0),
                  child: Text(context[index]['name'],
                      style: const TextStyle(
                          color: Colors.black87, fontSize: 16.0)),
                ),
                SizedBox(
                  width: 150.0,
                  child: Text(
                    '共有${context[index]['bookCount']}部作品',
                    style:
                        const TextStyle(fontSize: 14.0, color: Colors.black54),
                  ),
                ),
                const Expanded(
                  child: Icon(Icons.chevron_right),
                )
              ],
            ),
          ),
        );
      },
    );
  }
}
